<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <h:head>
        <title>#{bundle.customer}</title>
        <link href="./resources/css/default.css" rel="stylesheet" type="text/css" />
    </h:head>
    <h:body>
        <ui:composition>
        <h:form>
            <script type="text/javascript">  
                function handleSaveRequest(xhr, status, args) {  
                    if(args.validationFailed || !args.success) {  
                        jQuery('#dialog').effect("shake", { times:3 }, 100);  
                    } else {  
                        dlgcustomer.hide();  
                    }  
                }
                
                function handleDeleteRequest(xhr, status, args) {  
                    if(args.validationFailed || !args.success) {  
                        jQuery('#dialog').effect("shake", { times:3 }, 100);  
                    } else {  
                        dlgConfirmation.hide();  
                    }  
                }
                
            </script>  

            <p:toolbar>
                <p:toolbarGroup align="left">
                    <p:commandButton value="#{bundle.btnNew}" image="ui-icon-document"
                                     action="{customerBean.newData()}"  
                                     oncomplete="dlgCustomer.show()"
                                     update="displayCustomer"> 
                    </p:commandButton>

                    <p:commandButton value="#{bundle.btnOpen}" oncomplete="dlgCustomer.show()"
                                     image="ui-icon-disk" 
                                     update="displayCustomer" > 
                    </p:commandButton>

                    <p:commandButton type="button" value="#{bundle.btnDelete}" image="ui-icon-trash"
                                     onclick="dlgConfirmation.show()"
                                     update="displayCustomer" /> 

                    <p:commandButton type="push" value="#{bundle.btnPrint}" image="ui-icon-print"/>
                </p:toolbarGroup>
            </p:toolbar>
            <br />


            <p:dataTable id="dtCustomers" var="customer" value="{customerBean.lazyModel}"
                                 
                paginator="true" rows="10" paginatorPosition="bottom"
                rowsPerPageTemplate="5,10,15,30" rowIndexVar="noUrut"
                paginatorTemplate="{CurrentPageReport} {PreviousPageLink} {NextPageLink} {RowsPerPageDropdown}">
                 <p:column style="width: auto">
                    <f:facet name="header">No.</f:facet>
                    <h:outputText value="#{noUrut+1}" />
                 </p:column>
                <p:column style="width: auto">
                    <f:facet name="header">#{bundle.cif}</f:facet>
                    <h:outputText value="{customer.cif}" />
                </p:column>

                <p:column style="width: auto">
                    <f:facet name="header">#{bundle.globalName}</f:facet>
                    <h:outputText value="{customer.customerName}" />
                </p:column>
                <p:column style="width: auto">
                    <f:facet name="header">#{bundle.aliasName}</f:facet>
                    <h:outputText value="{customer.aliasName}" />
                </p:column>
                <p:column style="width: auto">
                    <f:facet name="header">#{bundle.adress}</f:facet>
                    <h:outputText value="{customer.IdAddressLine1}" />
                </p:column>
            </p:dataTable>        

             <p:confirmDialog message="#{bundle.confirmDelete}" appendToBody="true" 
                    header="#{bundle.confirmDeleteHeader}" severity="alert" widgetVar="dlgConfirmation">  
                <p:commandButton value="#{bundle.btnYes}" update="dtFcperiods growl" 
                                 oncomplete="handleDeleteRequest(xhr, status, args)"  
                                 actionListener="{customerBean.delete()}" />  
                <p:commandButton value="#{bundle.btnCancel}" onclick="dlgConfirmation.hide()" type="button" />   
            </p:confirmDialog> 
            
            <p:dialog header="#{bundle.customer}" widgetVar="dlgCustomer" closable="true" dynamic="true" style="top: -200px;left: -280px;">
                <p:ajax event="close" update="grwl" listener="{customerBean.handleClose}"/>
                <h:panelGrid id="displayCustomer" columns="3" styleClass="addELIT">
                    <p:tabView>
                        <p:tab title="#{bundle.cusledgen}">
                            <h:panelGrid columns="2" width="100%">
                                <p:outputPanel style="text-align: left;">
                                    <h:panelGrid columns="2" cellpadding="1" >
                                        <h:outputText style="padding: 0 15px 0 0" value= "#{bundle.cif} :"/>
                                        <p:inputText rendered="true" value="{customerBean.selectedData.cif}" />

                                        <!--h:outputLabel value= "Jenis :" />  
                                        <p:selectOneMenu>
                                            <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            <f:selectItem itemLabel="Pilihan 2" itemValue=""/>
                                        </p:selectOneMenu-->

                                        <h:outputLabel value= "#{bundle.globalName} :" />
                                        <p:inputText rendered="true" value="{customerBean.selectedData.customerName}" />  

                                        <h:outputLabel value= "#{bundle.aliasName} :" />
                                        <p:inputText rendered="true" value="{customerBean.selectedData.aliasName}" />

                                        <h:outputLabel value= "#{bundle.birthPlace} :" />
                                        <p:inputText rendered="true" value="{customerBean.selectedData.cusper.birthPlace}" />

                                        <h:outputLabel value= "#{bundle.birthDate} :" />
                                        <p:calendar pattern="dd/MM/yyyy" size="8"  /> 

                                        <h:outputLabel value= "#{bundle.religion} :" />
                                        <p:selectOneMenu>
                                            <f:selectItem itemLabel="Pilihan.." itemValue="0"/>
                                        </p:selectOneMenu>

                                        <h:outputLabel value= "#{bundle.customer} :" />
                                        <p:selectOneMenu>
                                            <f:selectItem itemLabel="Pilihan.." itemValue="0"/>
                                        </p:selectOneMenu>
                                    </h:panelGrid>
                                </p:outputPanel>

                                <p:outputPanel style="text-align: left;">
                                    <h:panelGrid columns="2" cellpadding="1" style="float: right; margin: -24px 0 0 0;">
                                        <h:outputLabel style="padding: 0 15px 0 0" value= "#{bundle.nationality} :" />
                                        <p:selectOneMenu>
                                            <f:selectItem itemLabel="Pilihan.." itemValue="0"/>
                                        </p:selectOneMenu>

                                        <h:outputLabel value= "#{bundle.nationalityRemark} :" />
                                        <p:inputText rendered="true" value="{customerBean.selectedData.cusper.nasionalityRemark}" />

                                        <h:outputLabel value= "#{bundle.sex} :" />
                                        <p:selectOneMenu>
                                            <f:selectItem itemLabel="#{bundle.sexFemale}" itemValue="F"/>
                                            <f:selectItem itemLabel="#{bundle.sexMale}" itemValue="M"/>
                                        </p:selectOneMenu>

                                        <h:outputLabel value= "#{bundle.maidenName} :" />
                                        <p:inputText rendered="true" value="{customerBean.selectedData.cusper.maidenName}" />

                                        <h:outputLabel value= "#{bundle.marstatus} :" />
                                        <p:selectOneMenu>
                                            <f:selectItem itemLabel="Pilihan.." itemValue="0"/>
                                        </p:selectOneMenu>

                                        <h:outputLabel value= "#{bundle.spouseName} :" />
                                        <p:inputText rendered="true" value="{customerBean.selectedData.cusper.spouseName}" />

                                        <h:outputLabel value= "#{bundle.spouserel} :" />
                                        <p:inputText rendered="true" value="{customerBean.selectedData.cusper.spouserel.spouserelId}" />
                                    </h:panelGrid>
                                </p:outputPanel>
                            </h:panelGrid>
                        </p:tab>

                        <p:tab title="#{bundle.addressLedgend}">
                                <h:panelGrid width="100%">
                                    <p:outputPanel style="text-align: left;">
                                        <h:panelGrid columns="2" style="text-align: left;">
                                            <h:outputLabel style="padding:0 30px 0 0;" value= "#{bundle.adress} 1 :" />
                                            <p:inputTextarea autoResize="false" rendered="true" rows="1" cols="97" value="{customerBean.selectedData.idAddressLine1}" /> 

                                            <h:outputLabel value= "#{bundle.adress} 2 :" />
                                            <p:inputTextarea autoResize="false" rendered="true" rows="1" cols="97" value="{customerBean.selectedData.idAddressLine2}" /> 

                                            <h:outputLabel value= "#{bundle.adress} 3 :" />
                                            <p:inputTextarea autoResize="false" rendered="true" rows="1" cols="97" value="{customerBean.selectedData.idAddressLine3}" />                                    
                                        </h:panelGrid>
                                    </p:outputPanel>
                                </h:panelGrid>

                                <h:panelGrid width="100%" columns="2" style="/*border:1px solid blue;*/vertical-align: top;" >
                                    <p:outputPanel style="text-align: left;">
                                        <h:panelGrid columns="2" cellpadding="2" style="text-align: left;/*border:1px solid blue;*/">
                                            <h:outputLabel value= "#{bundle.country} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.country.countryId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel value= "#{bundle.province} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.provinsi.provinsiId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel value= "#{bundle.district} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.district.districtId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel style="padding:0 15px 0 0;" value= "#{bundle.subdistrict} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.subdistrict.subdistrictId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel value= "#{bundle.village} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.village.villageId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>                                    
                                        </h:panelGrid>  
                                    </p:outputPanel>

                                    <p:outputPanel style="text-align: left;">
                                        <h:panelGrid columns="2" style="float:right;text-align: left;/*border:1px solid blue;*/margin:-72px 0 0 0;">
                                            <h:outputLabel style="padding:0 15px 0 0;" value= "#{bundle.postcode}:" />
                                            <p:inputText rendered="true" value="{customerBean.selectedData.idPostCode}" size="14" />

                                            <h:outputLabel value= "#{bundle.rt}/#{bundle.rw} :" />
                                            <h:panelGrid columns="2" style="margin:-3px 0 0 -3px;">
                                                <p:inputText rendered="true" value="{customerBean.selectedData.idRt}" size="3" />
                                                <p:inputText rendered="true" value="{customerBean.selectedData.idRW}" size="3" />
                                            </h:panelGrid>
                                        </h:panelGrid>
                                    </p:outputPanel>
                                </h:panelGrid>
                            </p:tab>

                            <p:tab title="#{bundle.residentLedgend}">
                                <h:panelGrid width="100%">
                                    <p:outputPanel style="text-align: left;">
                                        <h:panelGrid columns="2" style="text-align: left;">
                                            <h:outputLabel style="padding:0 15px 0 0;" value= "#{bundle.restatus} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.restatus.restatusId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel value= "#{bundle.adress} 1 :" />
                                            <p:inputTextarea autoResize="false" rendered="true" rows="1" cols="90" value="{customerBean.selectedData.resAddressLine1}" />

                                            <h:outputLabel value= "#{bundle.adress} 2 :" />
                                            <p:inputTextarea autoResize="false" rendered="true" rows="1" cols="90" value="{customerBean.selectedData.resAddressLine2}" />

                                            <h:outputLabel value= "#{bundle.adress} 3 :" />
                                            <p:inputTextarea autoResize="false" rendered="true" rows="1" cols="90" value="{customerBean.selectedData.resAddressLine3}" />
                                        </h:panelGrid>
                                    </p:outputPanel>
                                </h:panelGrid>

                                <h:panelGrid columns="2" width="100%" style="/*border:1px solid blue;*/vertical-align: top;" >
                                    <p:outputPanel style="text-align: left;">
                                        <h:panelGrid columns="2" style="text-align: left;/*border:1px solid blue;*/">
                                            <h:outputLabel value= "#{bundle.province} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.resProvinsiId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                                <f:selectItem itemLabel="Pilihan 2" itemValue=""/>
                                            </p:selectOneMenu> 

                                            <h:outputLabel value= "#{bundle.district} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.resDistrictId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                                <f:selectItem itemLabel="Pilihan 2" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel style="padding:0 53px 0 0;" value= "#{bundle.subdistrict} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.resSubdistrictId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                                <f:selectItem itemLabel="Pilihan 2" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel value= "#{bundle.village} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.resVillageId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                                <f:selectItem itemLabel="Pilihan 2" itemValue=""/>
                                            </p:selectOneMenu>
                                        </h:panelGrid>  
                                    </p:outputPanel>

                                     <p:outputPanel style="text-align: left;">
                                         <h:panelGrid columns="2" style="float:right;text-align: left;/*border:1px solid blue;*/margin:-42px 0 0 0;">
                                             <h:outputLabel style="padding:0 15px 0 0;" value= "#{bundle.postcode} :" />
                                            <p:inputText rendered="true" value="{customerBean.selectedData.resPostCode}" size="14" />

                                            <h:outputLabel value= "#{bundle.rt}/#{bundle.rw} :" />
                                            <h:panelGrid columns="2" style="margin:-3px 0 0 -3px;">
                                                <p:inputText rendered="true" value="{customerBean.selectedData.resRt}" size="3"/>
                                                <p:inputText rendered="true" value="{customerBean.selectedData.resRW}" size="3"/>
                                            </h:panelGrid>
                                        </h:panelGrid>
                                    </p:outputPanel>
                                </h:panelGrid>
                            </p:tab>

                            <p:tab title="DATA LAIN">
                                <h:panelGrid width="100%" columns="2" >
                                    <p:outputPanel style="text-align: left;">
                                        <h:panelGrid columns="2" style="text-align: left;">
                                            <h:outputLabel value= "#{bundle.idcard} :" />
                                            <p:selectOneMenu value="{customerBean.selectedData.idCardId}">
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                                <f:selectItem itemLabel="Pilihan 2" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel style="padding:0 15px 0 0;" value= "#{bundle.idcardno} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.idCardNo}" /> 

                                            <h:outputLabel value= "#{bundle.npwp} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.npwp}" /> 

                                            <h:outputLabel value= "#{bundle.phone} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.phone}" />

                                            <h:outputLabel value= "#{bundle.mobilePhone} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.mobilePhone}" />
                                        </h:panelGrid>
                                    </p:outputPanel>

                                    <p:outputPanel style="text-align:left;">
                                        <h:panelGrid columns="2" style="float:right;text-align: left;/*border:1px solid blue;*/margin:-25px 0 0 0;">
                                            <h:outputLabel value= "#{bundle.fax} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.fax}" />

                                            <h:outputLabel value= "#{bundle.email} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.email}" /> 

                                            <h:outputLabel value= "#{bundle.pin} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.pin}" /> 

                                            <h:outputLabel style="padding:0 15px 0 0;" value= "#{bundle.fingerprint} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.fingerprint}" /> 
                                        </h:panelGrid>
                                    </p:outputPanel>
                                </h:panelGrid>
                            </p:tab>

                        <p:tab title="#{bundle.cusper}">
                                <h:panelGrid width="100%" columns="2" >
                                    <p:outputPanel style="text-align: left;">
                                        <h:panelGrid columns="2" style="text-align: left;">
                                            <h:outputLabel value= "#{bundle.companyID} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.cusper.companyName}" />

                                            <h:outputLabel value= "#{bundle.adress} 1 :" />
                                            <p:inputTextarea autoResize="false" rendered="true" rows="1" cols="93" value="{customerBean.selectedData.cusper.addressLine1}" />

                                            <h:outputLabel value= "#{bundle.adress} 2 :" />
                                            <p:inputTextarea autoResize="false" rendered="true" rows="1" cols="93" value="{customerBean.selectedData.cusper.addressLine2}" /> 

                                            <h:outputLabel value= "#{bundle.adress} 3 :" />
                                            <p:inputTextarea autoResize="false" rendered="true" rows="1" cols="93" value="{customerBean.selectedData.cusper.addressLine3}" />

                                            <h:outputLabel style="padding:0 15px 0 0;" value= "#{bundle.officePhone} :" />
                                            <p:inputText value="{customerBean.selectedData.cusper.officePhone}"/>

                                            <h:outputLabel value= "#{bundle.incomesrc} :" />
                                            <p:selectOneMenu>
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel value= "#{bundle.incomeamt} :" />
                                            <p:selectOneMenu>
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel value= "#{bundle.corebus} :" />
                                            <p:selectOneMenu>
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>

                                            <h:outputLabel value= "#{bundle.occupation} :" />
                                            <p:selectOneMenu>
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu>
                                        </h:panelGrid>
                                    </p:outputPanel>
                                </h:panelGrid>
                            </p:tab>

                        <p:tab title="#{bundle.cuscor}">
                                <h:panelGrid width="100%" columns="2" >
                                    <p:outputPanel style="text-align: left;">
                                        <h:panelGrid columns="2" style="text-align: left;">
                                            <h:outputLabel value= "#{bundle.busentTpye} :" />
                                            <p:selectOneMenu>
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu> 

                                            <h:outputLabel style="padding:0 15px 0 0;" value= "#{bundle.busentypeRemark} :" />
                                            <p:inputText rendered="true"  value="{customerBean.selectedData.cuscor.busentypeRemark}" />  

                                            <h:outputLabel value= "#{bundle.establishDate} :" />
                                            <p:calendar pattern="dd/MM/yyyy" size="8"  />  

                                            <h:outputLabel value= "#{bundle.establishLocation} :" />
                                            <p:inputText rendered="true" value="{customerBean.selectedData.cuscor.establishedLocation}" />  
                                        </h:panelGrid>
                                    </p:outputPanel>

                                    <p:outputPanel style="text-align:left;">
                                        <h:panelGrid columns="2" style="float:right;text-align: left;/*border:1px solid blue;*/">
                                            <h:outputLabel value= "#{bundle.corebus} :" />
                                            <p:selectOneMenu>
                                                <f:selectItem itemLabel="Pilihan 1" itemValue=""/>
                                            </p:selectOneMenu> 

                                            <h:outputLabel value= "#{bundle.headCompany} :" />
                                            <p:inputText rendered="true" value="{customerBean.selectedData.cuscor.headCompany}" />

                                            <h:outputLabel style="padding:0 15px 0 0;" value= "#{bundle.authorizedCapital} :" />
                                            <p:inputText rendered="true" value="{customerBean.selectedData.cuscor.authoizedCapital}" />

                                            <h:outputLabel value= "#{bundle.numOfEmployees} :" />
                                            <p:inputText rendered="true" value="{customerBean.selectedData.cuscor.numOfEmployees}" /> 
                                        </h:panelGrid>
                                    </p:outputPanel>
                                </h:panelGrid>
                            </p:tab>

                        <p:tab title="#{bundle.corbod}">
                                <p:dataTable>
                                    <p:column style="width: auto">
                                        <f:facet name="header">#{bundle.seq}</f:facet>
                                        <h:outputText value="{corbod.seq}" />
                                    </p:column>    
                                    <p:column style="width: auto">    
                                        <f:facet name="header">#{bundle.directorName}</f:facet>
                                        <h:outputText value="{corbod.directorName}" />
                                    </p:column>    
                                    <p:column style="width: auto">    
                                        <f:facet name="header">#{bundle.jobTitle}</f:facet>
                                        <h:outputText value="{corbod.jobTitel}" />
                                    </p:column>
                                    <p:column style="width: auto">    
                                        <f:facet name="header">#{bundle.idcardno}</f:facet>
                                        <h:outputText value="{corbod.idcardNo}" />
                                    </p:column>
                                    <p:column style="width: auto">    
                                        <f:facet name="header">#{bundle.nationality}</f:facet>
                                        <h:outputText value="{corbod.nationalityId}" />
                                    </p:column>
                                </p:dataTable>
                            </p:tab>

                        <p:tab title="#{bundle.corbuslic}">
                                <p:dataTable>
                                    <p:column style="width: auto">
                                        <f:facet name="header">#{bundle.seq}</f:facet>
                                        <h:outputText value="{corbuslic.seq}" />
                                    </p:column>    
                                    <p:column style="width: auto">    
                                        <f:facet name="header">#{bundle.buslicNo}</f:facet>
                                        <h:outputText value="{corbuslic.buslicNo}" />
                                    </p:column>    
                                    <p:column style="width: auto">    
                                        <f:facet name="header">#{bundle.expiryDate}</f:facet>
                                        <h:outputText value="{corbuslic.expirydate}" />
                                    </p:column>
                                </p:dataTable>
                            </p:tab> 
                        </p:tabView>
                    </h:panelGrid>

                    <h:panelGrid cellpadding="0" styleClass="pComBtnSTDR">
                        <f:facet name="footer">
                            <p:commandButton value="#{bundle.btnSave}" image="ui-icon-disk" action="{customerBean.save()}"
                                             update="growl dtCustomers"
                                             oncomplete="handleSaveRequest(xhr, status, args)"/>
                            <p:commandButton  value="#{bundle.btnClose}" oncomplete="dlgCustomer.hide()" image="ui-icon-document"/>
                        </f:facet>
                    </h:panelGrid>
                </p:dialog>
            </h:form>
        </ui:composition>
    </h:body>
</html>